@import '../index/index.wxss';

page {
  background: #F4F5F9;
}

.serchBox {
  background: #FFFFFF;
  // padding-bottom: 56rpx;
  padding-top: 32rpx;
}

.serch {
  width: 670rpx;
  height: 80rpx;
  background: #FFFFFF;
  border-radius: 24rpx;
  border: 2rpx solid #020113;
  margin: 0rpx auto;
  display: flex;
  align-items: center;

  image {
    width: 56rpx;
    height: 56rpx;
    margin-left: 16rpx;
  }

  input {
    flex: 1;
    padding: 0 36rpx;
  }
}

.typeListbox {
  padding-top: 28rpx;
  padding-bottom: 29rpx;
  background-color: white;
}

.typeList {
  display: flex;

  margin-left: 32rpx;
  margin-right: 32rpx;

  .typeItem {
    flex: 1;



    text {
      display: block;
      margin: 0 auto;
      text-align: center;
      width: 170rpx;
      height: 88rpx;
      line-height: 88rpx;
      font-size: 36rpx;
      font-weight: bolder;
      border-radius: 44rpx;
    }

    .active {
      background: #D60010;
      color: white;
    }
  }
}




.agency {
  width: 750rpx;
  pointer-events: auto;
  background: #FFFFFF;
  // position: fixed;
  // top: 168rpx;
  // left: 0;
  position: fixed;

  box-shadow: 0rpx 8rpx 48rpx 0rpx rgba(1, 7, 19, 0.05);

  border-radius: 32rpx 32rpx 0rpx 0rpx;

  .title {
    display: flex;
    justify-content: space-between;
    padding-bottom: 19rpx;
    padding: 32rpx;
    position: relative;
    box-sizing: border-box;
    border-bottom: 2rpx solid rgba(2, 1, 19, 0.1);
    background: #D6000F;
    border-radius: 32rpx 32rpx 0rpx 0rpx;

    .title-left {
      font-size: 36rpx;
      font-weight: bolder;
      color: white;
      box-sizing: border-box;
      display: flex;
      align-items: center;
        image{
          width: 56rpx;
          height: 56rpx;
      
        }
        text{
          margin-left: 5rpx;
        }
    }

    .title-right {
  position: absolute;
  right: 32rpx;
  top: 32rpx;
color: #D6000F;
text-align: center;
font-weight: bolder;
      box-sizing: border-box;
      width: 100rpx;
height: 48rpx;
background: #FFFFFF;
border-radius: 24rpx;
text{
  font-size: 28rpx;
  font-weight: bolder;
  color: #D6000F;
  

}
    }
  }
}
.animation1{
  transition: all 0.5s;
}

.agencyList {
  margin-top: 32rpx;
  // height: 500rpx;
  height: 54vh;
  padding-bottom: 100rpx;
  box-sizing: border-box;
  background: #FFFFFF;

  .agencyItem {


    width: 686rpx;
    padding: 0 16rpx;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 72rpx;
    height: 72rpx;
    background: #F4F5F9;
    border-radius: 8rpx;
    font-size: 28rpx;
    color: #000000;
    margin: 0 auto;
    text-align: left;
    margin-bottom: 16rpx;
    position: relative;
    .dis{
      position:absolute ;
      right: 10rpx;
      top: 16rpx;
      width: 10rpx;
height: 10rpx;
border-radius: 50%;
background: #D6000F;
    }
  }
}


.nowals {
  margin-top: 32rpx;
  // height: 500rpx;
  height: 48vh;
  margin-bottom: 100rpx;

  background: #FFFFFF;



  color: #7c7c86;
  text-align: center;

}









.projectList {
  padding: 0 32rpx;
  box-sizing: border-box;
  padding-top: 46rpx;
  // min-height: 68vh;
  padding-bottom: 200rpx;

  .notUpload {
    position: absolute;
    right: 0;
    bottom: 17rpx;
    width: 166rpx;
    height: 42rpx;
    background: #D60010;
    border-radius: 21rpx;
    font-size: 28rpx;
    color: #FFFFFF;
    text-align: center;
    line-height: 42rpx;
  }

  .prompt {
    font-size: 24rpx;
    font-weight: bolder;
    text-align: center;
    display: block;
    margin-bottom: 24rpx;
    color: #A1A1A1;

  }

  .nowstate{
    width: 100rpx;
    height: 36rpx;

    border-radius: 21rpx;
    background: #D6000F;

font-size: 28rpx;
color: #FFFFFF;
line-height: 56rpx;
position: absolute;
bottom: 23rpx;
right: 23rpx;

font-size: 24rpx;
box-sizing: border-box;
text-align: center;
color: #FFFFFF;
line-height: 36rpx;

view{

}
  }

  .projectItem {
    display: flex;
    border-bottom: 2rpx solid rgba(2, 1, 19, 0.1);
    // margin: 0 24rpx;
    box-sizing: border-box;
    // padding-bottom: 32rpx;
    margin-bottom: 32rpx;
    position: relative;
    height: 208rpx;
    align-items: center;


    image {
      width: 132rpx;
      height: 132rpx;
      border-radius: 8px;
    }

    .projectItem-right {
      margin-left: 16rpx;
      flex: 1;

      .projectItem-right-one {

        display: flex;
        justify-content: space-between;


        .adress {
          font-size: 28rpx;
          font-weight: bolder;
          flex: 1;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
        }

        .money {
          font-size: 24rpx;
          color: #D6000F;
        }
      }

      .projectItem-right-two {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #A1A1A1;
      }

      .projectItem-right-treen {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #A1A1A1;
        width: 356rpx;
      }
    }
  }
}


.projectListScrool {
  background-color: rgb(244, 246, 250);

  box-sizing: border-box;
  padding-top: 46rpx;
  // height: 715rpx;
  height: 45vh;

  // padding-bottom: 450rpx;
  .prompt {
    font-size: 24rpx;
    font-weight: bolder;
    text-align: center;
    display: block;
    //   margin-bottom: 34rpx;
    color: #A1A1A1;
  }

  .nowstate{
    // width: 100rpx;
    height: 36rpx;

    border-radius: 21rpx;
    background: #D6000F;

font-size: 28rpx;
color: #FFFFFF;
line-height: 56rpx;
position: absolute;
bottom: 23rpx;
right: 23rpx;
padding: 0 10rpx;
font-size: 24rpx;
box-sizing: border-box;
text-align: center;
color: #FFFFFF;
line-height: 36rpx;

view{

}
  }

  .projectItem {

    // padding: 0 24rpx;
    box-sizing: border-box;

    width: 690rpx;
    margin: 0 auto;

position: relative;
    //   background: white;



    .projectItem-paddbox {
      margin: 0 24rpx;
      // padding: 24rpx 0;
      display: flex;
      align-items: center;
      border-bottom: 2rpx solid rgba(2, 1, 19, 0.1);
      height: 208rpx;
      position: relative;
    }

    .car {
      position: absolute;
      left: -22rpx;
      top: 11rpx;
      width: 140rpx;
      color: #FFFFFF;
      height: 42rpx;
      line-height: 42rpx;
      text-align: center;
      font-size: 28rpx;
      background: #D60010;
      border-radius: 0rpx 100rpx 100rpx 0rpx;
      // z-index: 2;
    }

    .notUpload {
      position: absolute;
      right: 0;
      bottom: 17rpx;
      width: 166rpx;
      height: 42rpx;
      background: #D60010;
      border-top-left-radius: 21rpx;
      border-bottom-left-radius: 21rpx;
      font-size: 28rpx;
      color: #FFFFFF;
      text-align: center;
      line-height: 42rpx;
    }

    image {
      width: 160rpx;
      height: 160rpx;
      border-radius: 8px;
    }

    .projectItem-right {
      margin-left: 16rpx;
      flex: 1;

      .projectItem-right-one {

        display: flex;
        justify-content: space-between;


        .adress {
          font-size: 28rpx;
          font-weight: bolder;
          flex: 1;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
        }

        .money {
          font-size: 24rpx;
          color: #D6000F;
        }
      }

      .projectItem-right-two {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #A1A1A1;
      }

      .projectItem-right-treen {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #A1A1A1;
        width: 356rpx;
      }
    }
  }
}

.projectListScrooldesig {
  background-color: rgb(244, 246, 250);

  box-sizing: border-box;
  padding-top: 46rpx;
  padding-bottom: 200rpx;

  // height: 715rpx;
  // height:31vh;
  .nowstate{
    width: 100rpx;
    height: 36rpx;

    border-radius: 21rpx;
    background: #D6000F;

font-size: 28rpx;
color: #FFFFFF;
line-height: 56rpx;
position: absolute;
bottom: 23rpx;
right: 23rpx;

font-size: 24rpx;
box-sizing: border-box;
text-align: center;
color: #FFFFFF;
line-height: 36rpx;

view{

}
  }

  // padding-bottom: 450rpx;
  .prompt {
    font-size: 24rpx;
    font-weight: bolder;
    text-align: center;
    display: block;
    //   margin-bottom: 34rpx;
    color: #A1A1A1;
  }

  .projectItem {

    // padding: 0 24rpx;
    box-sizing: border-box;

    width: 690rpx;
    margin: 0 auto;


    //   background: white;



    .projectItem-paddbox {
      margin: 0 24rpx;
      padding: 24rpx 0;
      display: flex;
      align-items: center;
      border-bottom: 2rpx solid rgba(2, 1, 19, 0.1);
      height: 208rpx;
      position: relative;
    }

    .car {
      position: absolute;
      left: -22rpx;
      top: 11rpx;
      width: 140rpx;
      color: #FFFFFF;
      height: 42rpx;
      line-height: 42rpx;
      text-align: center;
      font-size: 28rpx;
      background: #D60010;
      border-radius: 0rpx 100rpx 100rpx 0rpx;
      // z-index: 2;
    }

    .notUpload {
      position: absolute;
      right: 0;
      bottom: 17rpx;
      width: 166rpx;
      height: 42rpx;
      background: #D60010;
      border-top-left-radius: 21rpx;
      border-bottom-left-radius: 21rpx;
      font-size: 28rpx;
      color: #FFFFFF;
      text-align: center;
      line-height: 42rpx;
    }

    image {
      width: 160rpx;
      height: 160rpx;
      border-radius: 8px;
    }

    .projectItem-right {
      margin-left: 16rpx;
      flex: 1;

      .projectItem-right-one {

        display: flex;
        justify-content: space-between;


        .adress {
          font-size: 28rpx;
          font-weight: bolder;
          flex: 1;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
        }

        .money {
          font-size: 24rpx;
          color: #D6000F;
        }
      }

      .projectItem-right-two {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #A1A1A1;
      }

      .projectItem-right-treen {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #A1A1A1;
        width: 356rpx;
      }
    }
  }
}







.projectItemIng {
  position: relative;
  margin: 0 auto;
  box-sizing: border-box;
  width: 690rpx;

  
  .projectOne {
    position: relative;

    height: 208rpx;

    .projectOne-box {
      display: flex;
      // position: relative;
      margin: 0 24rpx;
      padding: 24rpx 0;
      align-items: center;
      box-sizing: border-box;
      border-bottom: 2rpx solid rgba(2, 1, 19, 0.1);

    }
  }

  .car {
    position: absolute;
    left: 6rpx;
    top: 20rpx;
    width: 140rpx;
    color: #FFFFFF;
    height: 42rpx;
    line-height: 42rpx;
    text-align: center;
    font-size: 28rpx;
    background: #D60010;
    border-radius: 0rpx 100rpx 100rpx 0rpx;

    font-size: 28rpx;
    // z-index: 2;
  }

  .notUpload {
    position: absolute;
    right: 0;
    bottom: 17rpx;
    width: 166rpx;
    height: 42rpx;
    background: #D60010;
    border-top-left-radius: 21rpx;
    border-bottom-left-radius: 21rpx;
    font-size: 28rpx;
    color: #FFFFFF;
    text-align: center;
    line-height: 42rpx;
  }

  image {
    width: 160rpx;
    height: 160rpx;
    border-radius: 8rpx;
  }

  .projectItem-right {
    margin-left: 16rpx;
    flex: 1;

    .projectItem-right-one {

      display: flex;
      justify-content: space-between;


      .adress {
        font-size: 28rpx;
        font-weight: bolder;
        flex: 1;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
      }

      .money {
        font-size: 24rpx;
        color: #D6000F;
      }
    }

    .projectItem-right-two {
      margin-top: 13rpx;
      font-size: 24rpx;
      margin-top: 4rpx;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      color: #A1A1A1;
    }

    .projectItem-right-treen {
      margin-top: 13rpx;
      font-size: 24rpx;
      margin-top: 4rpx;
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
      color: #A1A1A1;
      width: 356rpx;
    }
  }

  .writeBackground {
    background: white !important;


    border-radius: 16rpx;
    box-shadow: 0rpx 8rpx 48rpx 0rpx rgba(1, 7, 19, 0.05);
  }

  .projectbtn {
    width: 610rpx;
    height: 0;
    background: #D60010;
    border-radius: 0px 0px 32rpx 32rpx;
    margin: 0 auto;
    box-sizing: border-box;
    transition: all 0.3s;
    display: flex;
    overflow: hidden;

    view {

      flex: 1;

      text-align: center;
      color: #FFFFFF;
      border-right: 2rpx solid rgba(255, 255, 255, .5);
      border-radius: 1px;

    }
  }

  .showbtn {
    height: 109rpx;
    transition: all 0.3s;
    padding: 21rpx 0;
    box-sizing: border-box;
    line-height: 65rpx;
    margin-bottom: 32rpx;
  }


  .projectTwo {
    width: 646rpx;
    transition: all 0.3s;
    height: 0rpx;
    overflow: hidden;
    // height: 161rpx;
    background: #FFFFFF;
    box-shadow: 0rpx 8rpx 48rpx 0rpx rgba(1, 7, 19, 0.05);
    border-radius: 0rpx 0rpx 16rpx 16rpx;
    margin: 0 auto;

    box-sizing: border-box;

    .instructions {
      display: flex;
      font-size: 28rpx;

      view {
        flex: 1;
        text-align: center;
      }
    }

    .progress {
      display: flex;
      // align-items: center;

      margin-left: 70rpx;

      .mypadding {
        padding-top: 12rpx;
      }

      .round {
        width: 16rpx;
        height: 16rpx;
        border: 2rpx solid #D6000F;
        border-radius: 50%;

      }

      .complete {
        background: #D6000F;
      }

      .line {
        background: #D6000F;
        // width: 149rpx;
        width: 71rpx;
        height: 2rpx;
        margin-top: 10rpx;

      }

    }

    .calendar {
      display: flex;
      margin-top: 7rpx;

      .calendarItem {
        flex: 1;
        font-size: 24rpx;
        // color: #020113;
        padding-right: 30rpx;
        text-align: center;
        color: #929eb2;
      }
    }
  }

  .show {
    height: 161rpx;
    transition: all 0.3s;
    padding: 15rpx 0;
    box-shadow: 0rpx 8rpx 48rpx 0rpx rgba(1, 7, 19, 0.05);
  }
}

.projectItemIngshow {
  padding-bottom: 32rpx;
  margin-top: 20rpx;
}


.progresstwo {
  display: flex;
  // align-items: center;

  margin-left: 157rpx;

  .mypadding {
    padding-top: 12rpx;
  }

  .round {
    width: 16rpx;
    height: 16rpx;
    border: 2rpx solid #D6000F;
    border-radius: 50%;

  }

  .complete {
    background: #D6000F;
  }

  .line {
    margin-top: 9rpx;
    background: #D6000F;
    width: 148rpx;
    height: 2rpx;

  }

}

.calendar {
  display: flex;
  margin-top: 7rpx;

  .calendarItem {
    flex: 1;
    font-size: 24rpx;
    color: #020113;
    padding-left: 19rpx;
    text-align: center;
    color: #929eb2;
  }
}



.wixianmu {
  text-align: center;
// height: 45vh;
box-sizing: border-box;
padding-top: 108rpx;
  image {
    width: 320rpx;
    height: 268rpx;
    margin: 0rpx auto 26rpx;
    display: block;
    margin-left: 236rpx;
  }

  text {
    color: #7c7c86;
    width: 320rpx;
    margin: 0 auto;
    text-align: center;
    display: block;
  }
}




.touchbottom {
  margin-top: 20rpx;

  text-align: center;

  color: #A9A8AF;
  padding-bottom: 20rpx;
}

.redcolor {
  color: #D6000F !important;
}

.btnspaidan{
  width: 300rpx;
height: 72rpx;
background: #D6000F;
border-radius: 40rpx;
font-size: 36rpx;
font-weight: bolder;
color: #FFFFFF;
line-height: 72rpx;
text-align: center;
margin: 0 auto 56rpx;
}



.nowstatest{
  width: 100rpx;
  height: 36rpx;

  border-radius: 21rpx;
  background: #D6000F;

font-size: 28rpx;
color: #FFFFFF;
line-height: 56rpx;
position: absolute;
bottom: 33rpx;
right: 23rpx;

font-size: 24rpx;
box-sizing: border-box;
text-align: center;
color: #FFFFFF;
line-height: 36rpx;

view{

}
}

.bindbtnspaidan{
  width: 300rpx;
height: 72rpx;
background: #D6000F;
border-radius: 40rpx;
line-height: 72rpx;
text-align: center;
font-size: 36rpx;
font-weight: 500;
color: #FFFFFF;
margin: 0 auto;
margin-bottom: 34rpx;
}


.contenpaidantMask{
 position: fixed;
 left: 0;
 top: 0;
 z-index: 30;
 background: rgba(0, 0, 0, 0.8);
 display: flex;
 align-items: center;
 justify-content: center;
 width: 750rpx;
 height: 100vh;
 z-index: 200;
 .contentpaaa{
   margin-top: 50rpx;
   .title{
    width: 718rpx;
    height: 163rpx;
    background: #D6000F;
    border-radius: 32rpx 32rpx 0rpx 0rpx;
    text-align: center;

font-size: 48rpx;
font-weight: bolder;
color: #FFFFFF;
line-height: 163rpx;
   }
   .asdprojectList{
     height: 55vh;
     background: white;
   }
   .projectItem {
     position: relative;
.checkout{
  position: absolute;
  left: 0rpx;
  top: 0rpx;
  z-index: 50;
  image{
    width: 80rpx !important;
    height: 80rpx !important;
  }
}
    // padding: 0 24rpx;
    box-sizing: border-box;

    width: 680rpx;
    margin: 0 auto;

position: relative;
    //   background: white;



    .projectItem-paddbox {
      margin: 0 24rpx;
      // padding: 24rpx 0;
      display: flex;
      align-items: center;
      border-bottom: 2rpx solid rgba(2, 1, 19, 0.1);
      height: 208rpx;
      position: relative;
    }

    .car {
      position: absolute;
      left: -22rpx;
      top: 11rpx;
      width: 140rpx;
      color: #FFFFFF;
      height: 42rpx;
      line-height: 42rpx;
      text-align: center;
      font-size: 28rpx;
      background: #D60010;
      border-radius: 0rpx 100rpx 100rpx 0rpx;
      // z-index: 2;
    }

    .notUpload {
      position: absolute;
      right: 0;
      bottom: 17rpx;
      width: 166rpx;
      height: 42rpx;
      background: #D60010;
      border-radius: 21rpx;
      font-size: 28rpx;
      color: #FFFFFF;
      text-align: center;
      line-height: 42rpx;
    }

    image {
      width: 160rpx;
      height: 160rpx;
      border-radius: 8px;
    }

    .projectItem-right {
      margin-left: 16rpx;
      flex: 1;

      .projectItem-right-one {

        display: flex;
        justify-content: space-between;


        .adress {
          font-size: 28rpx;
          font-weight: bolder;
          flex: 1;
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
        }

        .money {
          font-size: 24rpx;
          color: #D6000F;
        }
      }

      .projectItem-right-two {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        color: #A1A1A1;
      }

      .projectItem-right-treen {
        margin-top: 13rpx;
        font-size: 24rpx;
        margin-top: 4rpx;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        width: 356rpx;
        color: #A1A1A1;
      }
    }
  }

  .outa{
    background: white;
    display: flex;
    justify-content:space-between;
    padding:0 14rpx ;
    padding-top: 40rpx;
    padding-bottom: 40rpx;
  
    .checkoutall{
      display: flex;
      color: #A1A1A1;
      align-items: center;
      font-size: 28rpx;
      .checkoleft{
        display: flex;
        align-items: center;
      }
      image{
        // width: 50rpx !important;
        // height: 50rpx !important;
      }
      text{
        margin-left: 0rpx;
      }
    }
    .checkoutalllength{
      line-height: 88rpx;
      margin-left: 33rpx;
      color: #A1A1A1;
      
font-size: 28rpx;
    }
    .btsa{
      width: 318rpx;
height: 88rpx;
background: #D6000F;
border-radius: 44rpx;
text-align: center;
line-height: 88rpx;

font-weight: bold;
color: #FFFFFF;
font-size: 32rpx;
    }
  }
 }
}

.puta-left{
  display: flex;
  align-items: center;
  justify-content: center;
  image{
    width: 80rpx !important;
    height: 80rpx !important;
  }
}

.zhanwu{
  text-align: center;
  image{
    width: 320rpx;
    height: 268rpx;
    margin: 200rpx auto 26rpx;
    display: block;
    margin-left: 236rpx;
  }
  text{
    color: #7c7c86;
    width: 320rpx;
    margin: 0 auto;
    text-align: center;
    margin-left: 220rpx;
    display: block;
  }
}